import React from "react";
import { Icon, Pagination, Checkbox, Popconfirm} from 'tinper-bee';

import Table from 'bee-table';
import 'bee-table/build/Table.css';

import multiSelect from "bee-table/build/lib/multiSelect";
const MultiSelectTable = multiSelect(Table, Checkbox);

import "../common/index.less";
import {buttonClick, onRowDoubleClick,RenderHtml, setButtonDisabled, refersh, getSelectedDataFunc} from "../common/index.js";
import { searchTpl, btnListTpl, treemodalTpl } from "./../tpl/index.js"
import { ButtonConfig } from "./../common/const.js";
import createYGCPage from "./../../../components/CreateYGCPage/index.jsx";
import YGCreateModalTree from "./../../../components/YGCreateModalTree/index.jsx"
const {
    ListTableButtons
} = ButtonConfig;

@createYGCPage({})
export default class Browse extends React.Component{
    constructor(props){
        super(props);
        this.state={
            columns : [
                { title: "企业名称", dataIndex: "name", key: "name", width: 300, render :(text, record, index)=>{
                    return(
                        <span onClick={()=>onRowDoubleClick.call(this, record, index, event)}  className= "rowClassName" >{text}</span> 
                    ) 
                }},
                { title: "企业角色", dataIndex: "role", key: "role", width: 100, render:(text, record, index)=>{
                    let  selectOptions = {
                        10 : {value:10,label:"业主方",display: '业主方'},
                        20:{ value:20,label:"施工方",display: '施工方'},
                        30:{ value:30,label:"监理方",display: '监理方'},
                        40:{ value:40,label:"设计方",display: '设计方'},
                        50:{value:50,label:"客户方",display: '客户方'}
                        
                    };
                    return(
                        <span>{selectOptions[text]? selectOptions[text].label:'业主方'}</span> 
                    ) 
                } },
                { title: "组织范围", dataIndex: "orgNames", key: "orgNames", width:300},
                { title: "计划授权数", dataIndex: "planAuthorizedNum", key: "planAuthorizedNum", width: 100 },
                { title: "实际授权数", dataIndex: "realAuthorizedNum", key: "realAuthorizedNum", width: 100 },
                { title: "人员数", dataIndex: "personnelNum", key: "personnelNum", width: 100 },
                { title: "操作", dataIndex: "operation", key: "operation", width: 100, fixed: "right", render :(text, record, index)=>RenderHtml['operationHtml'].call(this, text, record, index, ListTableButtons)}
            ],
            checkedKeys:[],//組織生成企業
            checkedKeysId:[],//組織生成企業
            pkOrgs: [], //组织名称
            orgId: [],
            orgData:[],
            businessData:[],
            selectedTableData :[],
            tableData:[]
          
        }
        this.buttonClick = buttonClick.bind(this);
        this.onRowDoubleClick = onRowDoubleClick.bind(this);
        this.searchTpl = searchTpl;
        this.getSelectedDataFunc = getSelectedDataFunc.bind(this);
        this.treemodalTpl= treemodalTpl.call(this);
    }
    componentDidMount(){
        let buttons = {}
        if(!'企业管理员'){//
            buttons ={"Add": true,"Delete": true}
        }else{
            buttons ={"Add": false,"Delete": false}
        }
        
        setButtonDisabled.call(this, buttons);
        refersh.call(this )
    }

    render(){
        let {
            columns,
            tableData
        } = this.state;
        return(
            <div className=" list ygc-list">
                <div className=' header ygc-list-header-area'>
                    <div className='ygc-list-header-title'>人员管理</div>
                    <div className='ygc-list-header-button header-button'>
                        {this.props.YGCreateButton({
							btnTpl: btnListTpl.call(this),
							buttonClick: (key)=>buttonClick.call(this, Object.values(key)[0])
						})}
                    </div>
                </div>
                {YGCreateModalTree.call(this, {...this.treemodalTpl})}
                <div className="ygc-search-Area header-search">
                    {this.props.YGCCreateSearch(this.searchTpl, {searchBtnClick : (selectedS)=>this.buttonClick('Search', selectedS)})}
                </div>
                <div id = "table" className="table ygc-table-Area">
                    <div className={'header-title '}>
                        <span>企业列表</span>
                    </div>
                   {console.log( window.clientHeight ? window.clientHeight-200 : window.innerHeight-200)}
                    <div  className="ygc-projectIndicators-table">
                        <MultiSelectTable 
                            emptyText={() => '暂无数据'}
                            columns={columns} 
                            data={tableData} 
                            multiSelect={{
                                type: "checkbox"
                            }}
                            className = {"complex-table"}
                            onRowDoubleClick = {this.onRowDoubleClick}
                            getSelectedDataFunc= {(selectedList,record,index, newData)=>this.getSelectedDataFunc(selectedList,record,index, newData, "selectedTableData")}
                        />
                      
                    </div>
                </div>
            </div>
        )
    }
}